/* vant4的 Toast 和 Popup 样式冲突,会导致 Toast 变成白底 */
.van-popup.van-toast{
    background: var(--van-toast-background) !important;
    box-sizing: content-box !important;
    /* 下面3条css,影响不大 */
    transition: all var(--van-duration-fast) !important;
    width: var(--van-toast-default-width) !important;
    max-width: var(--van-toast-max-width) !important;
}
.van-popup.van-toast .van-toast__icon{
    font-size: var(--van-toast-icon-size) !important;
}




.hide{
    display: none;
}
button:focus {outline:none;}
*{box-sizing: border-box;}
.wid750{width:750px;margin:0 auto;font-size: 100px!important;}
.bgcolor{
    width: 100%;
    height: 100vh;
    background: linear-gradient(to right, #0eafc1, #69c3b9);
    background-size: contain;
    z-index: 1;
    position: relative;
}
.fontweight{
    font-weight: bold;
}
.coloseicon{
    width: 1.43rem;
    height: 1.02rem;
    background: url(../img/closeicon.png) no-repeat center;
    background-size: contain;
    position: absolute;
    top: .2rem;
}
.logoicon{
    width:.95rem;
    height: 1.12rem;
    background: url(../img/logoicon.png) no-repeat center;
    background-size: contain;
    position:absolute;
    right: .64rem;
    top: .17rem;
}
.mainwrap{
    padding:1rem  .66rem 1.42rem .66rem;
    min-height: 11.3rem;
}
.mainwrap.dangan{
    padding:.3rem  .66rem 1.42rem .66rem;
    min-height: 11.3rem;
}
.mainwrap.pass{
    padding:1.55rem  .66rem 1rem .66rem;
    min-height: 11.3rem;
}
.mainwrap.ceping{
    padding:1.5rem  .6rem 1.42rem .6rem;
    min-height: 11rem;
}
.maincontent{
    width: 100%;
    min-height: 10rem;
    background: linear-gradient(to bottom, #ffffff, #d6ece9);
    border-radius: .5rem;
    position: relative;
    box-shadow: 5px 1px 18px rgba(0, 0, 0, 0.25);
}
.havebottom::after,.cepingcon::after{
    content: "";
    height: 1rem;
    width: 95%;
    background: #d6ece9;
    opacity: 0.5;
    border-radius: .5rem;
    bottom: -.3rem;
    left: 2.5%;
    position: absolute;
    z-index: -1;
}
.havebottom::before,.cepingcon::before{
    content: "";
    height: 1rem;
    width: 90%;
    background: #d6ece9;
    opacity: 0.3;
    border-radius: .5rem;
    bottom: -.6rem;
    left: 5%;
    position: absolute;
    z-index: -1;
}
/****输入密码****/

.lockimg{
    width: 2.15rem;
    height: 2.15rem;
    background-size: contain;
    margin-top: 1rem;
    margin-left: 50%;
    transform: translateX(-50%);
}
.lockcon .p1{
    font-size: .45rem;
    color: #248886;
    text-align: center;
}
.lockcon .p2{
    font-size: .3rem;
    color: #999;
    text-align: center;
}
.lockcon .passwordview{
    padding: .43rem .38rem .31rem .38rem;
}
.lockcon .passwordinput{
    width: 100%;
    height: 1.05rem;
    border-radius: .15rem;
    border: .001rem solid #999;
    padding: 0 .3rem;
    text-align: center;
    background: #ebf5f4;
    line-height: 1.05rem;
    font-size: .36rem;
    position: relative;
}
.lockcon .passwordinput::input-placehoder{
    color: #d1d1d1;
}
.lockcon .passwordinput::after{
    content: "";
    width: .42rem;
    height: .32rem;
    background: url(../img/mima_icon.png) no-repeat center;
    background-size: contain;
    position: absolute;
    right: .3rem;
    top: 0;
}
.lockcon .nextbtnview{
    padding: 0 .38rem;
}
.nextbtnview .btnbox{ 
    display: inline-block;
    width: 100%;
    height: 1.02rem;
    line-height: 1.02rem;
    background: #f0893e;
    border-radius: .45rem;
    text-align: center;
    font-size: .45rem;
    color: #ffffff;
    border: .04rem solid #fbd597;
    box-shadow: 5px 1px 18px rgba(0, 0, 0, 0.18);
}
/****宝贝信息****/
.infotitview{
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-bottom: .35rem;
}
.infoincon{
    width: .95rem;
    height: .95rem;
    background-size: contain;
    margin-right: .15rem;
}
.titinfo .p1{
    font-size: .35rem;
    color: #ffffff;
    font-weight: bold;
}
.titinfo .p2{
    font-size: .25rem;
    color:#e5e6e1;
}
.babyinfo{
    padding: .43rem .38rem .35rem;
    height: 100%;
}
.babyinfo .nameview{
    margin-bottom: .32rem;
}
.babyinfo .p1{
    font-size: .45rem;
    color: #248886;
    margin-bottom: .18rem;
}
.babyinfo .inputtext{
    width: 100%;
    height: .9rem;
    border-radius: 0.15rem;
    border: 0.001rem solid #999;
    padding: 0 0.3rem;
    line-height: .9rem;
    font-size: .35rem;
}
.babyinfo .inputtext::placeholder{
    color: #c8c9cc;
}
.gendeoption{
    display: flex;
    flex-direction: row;
}
.gendeoption .option{
    width: 47%;
    height: 2.2rem;
    background: #e7f3f1;
    border-radius: .15rem;
    border: .001rem solid #999;
}
.option.boyview{
    margin-right: 3%;
}
.option.girlview{
    margin-left: 3%;
}
.gendeoption .optioninner{
    display: flex;
    height: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.gendeoption .radioview{
    height: .42rem;
    display: flex;
    align-items: center;
    flex-direction: row;
}
.gendeoption .radioview p{
    font-size: .35rem;
    color: #248886;
    font-weight: bold;
}
.gendeoption .headimg{
    width: 1.2rem;
    height: .9rem;
    margin-bottom: .2rem;
}
.boyimg{
    background: url(../img/boyicon.png) no-repeat center;
    background-size: contain;
}
.girlimg{
    background: url(../img/girlicon.png) no-repeat center;
    background-size: contain;
}

/* 隐藏原始的单选按钮 */  
.hidden-radio {  
    position: absolute;  
    opacity: 0;  
    z-index: -1;  
}  
/* 自定义单选按钮样式 */  
.radio-button {  
    display: inline-block;  
    width: .36rem;
    height: .36rem;
    background:#dce8e6;
    border-radius: 50%;
    margin-right: .12rem;
}  
.option.seled{
    background: #f0893e;
}
.option.seled p{
    color: #ffffff;
}
.option.seled .radio-button{
    background: url(../img/seled_icon.png) no-repeat center;
    background-size: contain;
}
.boyview.seled .boyimg{
    background: url(../img/boyicon_seled.png) no-repeat center;
    background-size: contain;
}
.girlview.seled .girlimg{
    background: url(../img/girlicon_seled.png) no-repeat center;
    background-size: contain;
}
/****答题***/
.scheduleview .jindu{
    font-size: .3rem;
    color: #fff;
}
.barview{
    width: 100%;
    height: .16rem;
    background: #9cb9b4;
    border-radius: .25rem;
    position: relative;
    margin: .12rem 0 .2rem;
}
.barview .probar{
    position: absolute;
    left: 0;
    width: 20%;
    height: 100%;
    background: #ed713b;
    border-radius: .25rem;
}
.scheduleview .tips{
    width: 100%;
    height: .5rem;
    background: linear-gradient(to right, #ed7c30, #89bea4);
    line-height: .5rem;
    font-size:.3rem;
    color: #fff;
    margin-bottom: .2rem;
    padding-left: .1rem;
}
.question-option{
    width: 100%;
    height: 1.05rem;
    border-radius: 0.15rem;
    border: 0.001rem solid #999;
    padding: 0 0.3rem;
    line-height: 1.05rem;
    font-size: .35rem;
    display: flex;
    align-items: center;
    flex-direction: row;
    margin-top: .5rem;
    color: #248886;
} 
.question-option .radioicon{
    width: 0.36rem;
    height: 0.36rem;
    background: #dce8e6;
    border-radius: 50%;
    margin-right: 0.45rem;
}
.question-option.seled {
    background: #f0893e;
    border:.04rem solid #fffadc;
    box-shadow: 5px 1px 18px rgba(0, 0, 0, 0.18);
    color: #fff;
}
.question-option.seled .radioicon{
    background: url(../img/seled_icon.png) no-repeat center;
    background-size: contain;
}
.btnview{
    position: absolute;
    bottom: 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    left: 0;
}
.btnview .btnbox{
    width: 2.9rem;
    border: none;
    display: inline-block;
    height: 1.25rem;
    line-height: 1.25rem;
    background: #f0893e;
    border-radius: .45rem;
    text-align: center;
    font-size: .45rem;
    color: #ffffff;
    box-shadow: 5px 1px 18px rgba(0, 0, 0, 0.18);
}
.prebtn .btnbox{
    font-size: .4rem;
    border-radius:0 .45rem 0 .45rem;
}
.nextbtn .btnbox{
    font-size: .4rem;
    border-radius:.45rem 0 .45rem 0;
}
.checkresult{
   margin-top: 1.5rem;
}
/***测评结果**/
.resultwrap{
    padding: 1.5rem  .66rem .5rem .66rem;
    min-height: 4rem;
}
.resultwrap .maincontent{
    background-image: linear-gradient(to bottom,#ffffff,#d5ebe8);
}
.resulttop{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.resulttop .h2{
    font-size: .5rem;
    color: #268889;
    font-weight: bold;
}
.resulttop .p1{
    font-size: .3rem;
    font-weight: bold;
}
.scoreview{
    width: 2.1rem;
    height: 2.1rem;
    background: #f0893e;
    border-radius: .15rem;
    line-height: 2.1rem;
    text-align: center;
    color: #fff;
    border: .04rem solid #fefbec;
    /* background-clip: padding-box;
    background-image: linear-gradient(to right,#fefbec,#f6b058); */ 
}
.scoreview span{
    display: inline-block;
}
.scoreview .s1{
    font-size: .9rem;
    font-weight: bold;
}
.scoreview .s2{
    font-size: .4rem;
}
.resuttips{
    width: 100%;
    padding: .25rem;
    background: #fdfdfd;
    border: .01rem solid #cfcfcf;
    border-radius: .15rem;
    font-size: .25rem;
    color: #666867;
    margin-top: .35rem;
}
.resultchart{
    width: 100%;
    height: 5rem;
    background: #f5b285;
    margin-top: .35rem;
}
.fenxih3{
    text-align: center;
}
.fenxih3 .ss{
    display: inline-block;
    width: 1.7rem;
    height: .55rem;
    background-image: linear-gradient(to bottom,#70b9c2,#42909d);
    border-radius: .25rem;
    font-size: .3rem;
    color: #fff;
    line-height: .55rem;
    margin-top: .5rem;
    position: relative;
}
.fenxih3 .ss.ss::before{
    content: "";
    width: .9rem;
    height: .03rem;
    background-image: linear-gradient(to right,#f0f6f6,#b8cfd7);
    position: absolute;
    left: -.9rem;
    top: 50%;
    transform: translateY(-50%);
}
.fenxih3 .ss.ss::after{
    content: "";
    width: .9rem;
    height: .03rem;
    background-image: linear-gradient(to right,#b8cfd7,#f0f6f6);
    position: absolute;
    right: -.9rem;
    top: 50%;
    transform: translateY(-50%);
}
.analyseview{
    margin-top: .25rem;
}
.analysetop{
    width: 100%;
    height: .6rem;
    background-image: linear-gradient(to right,#76bfc8,#3b8995);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 .5rem 0 .19rem;
    color: #fff;
    margin-bottom: .1rem;
    box-shadow:0px 4px 15px rgba(0, 0, 0, 0.25);
}
.analyseview.abnormal .analysetop{
    background-image: linear-gradient(to right,#e71422,#faddb7);
}
.analysetop .pleft{
    font-size: .3rem;
    font-weight: bold;
}
.analysetop .pright{
    font-size: .2rem;
    display: flex;
    align-items: center;
}
.analysetop .pright .sum{
    font-size: .4rem;
    color: #fff;
}
.analyseview.abnormal .analysetop .pright .sum{
    color: #e7141a;
}
.analyseitem{
    padding: .25rem;
    background: #efefef;
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.25);
}
.itemtips{
    background: #dbdbdb;
    color: #c9291b;
    font-size: .25rem;
    text-align: center;
    margin-bottom: .25rem;
}
.textview p,.resulttext p{
    text-indent: 2em;
    font-size: .25rem;
    line-height: 1.7em;
    color: #737373;
}
.analyseview.abnormal .textview,.analyseview.abnormal .resulttext p{
    color:#ca291c;
}
.analyseview.abnormal .resulttext p.keyword{
    font-weight: bold;
}
.itemretips .zticon{
    margin-right: .12rem;
}
.itemretips .normalicon{
    width: .6rem;
    height: .6rem;
    background: url(../img/xiaolian_icon.png) no-repeat center;
    background-size: contain;
}
.itemretips .abnormalicon{
    width: .46rem;
    height: .43rem;
    background: url(../img/yichang_icon.png) no-repeat center;
    background-size: contain;
}
.itemretips{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin: .25rem 0 .15rem;
}
.itemretips .rrt{
    padding: .07rem .2rem;
    background-image: linear-gradient(to right,#3d8a95,#74bdc6);
    color: #fff;
    font-size: .28rem;
    font-weight: bold;
}
.itemretips.abnor .rrt{
    background: #d4244b;
}
/***开始测评***/
.cepingcon{
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, #d6dbee, #d5ebe8);
    border-radius: 0.5rem;
    position: relative;
    padding: 0.2rem 0 .4rem;
}
.cepingcon .linebg{
    width: 100%;
    height: 6.7rem;
    position: absolute;
    top: 4rem;
    left: 0;
    background: url(../img/ceping_linebg.png) no-repeat center;
    background-size: cover;
}
.cepingtop{
    width: 100%;
    /* background: url(../img/cloud_bg.png) no-repeat #d5daed;
    background-size: contain; */
}
.cepingtop .topbg{
    width: 5.33rem;
    height: 1.61rem;
    background: url(../img/ceping_toptiit.png) no-repeat center;
    background-size: contain;
    margin: .25rem 0 .2rem 0;
    /* margin: .38rem 0 .3rem .38rem; */
}
.cepingcon .headimgbg{
    width: 3.2rem;
    height: 4rem;
    background: url(../img/headimg_bg.png) no-repeat;
    background-size: contain;
    position: absolute;
    right: -.5rem;
    bottom: 1.4rem;
}
.ceping-der{
    width: 3rem;
    height: 3.2rem;
    background: url(../img/ceping_der.png) no-repeat center;
    background-size: contain;
    margin:.3rem 0 .3rem .4rem;
    position: relative;
    z-index: 1;
}
.cepingtxt{
    font-size: .25rem;
    color: #7c7c7c;
    padding: 0 .5rem 0 .4rem;
    line-height: 1.5em;
    font-weight: bold;
}
.cepingtxt .keyword{
    color: #f17b31;
}
.ceping .nextbtnview{
    padding: 0 .6rem;
}
.resultwrap .saveresult{
    display: inline-block;
    width: 90%;
    height: .9rem;
    line-height: .9rem;
    background: #f0893e;
    border-radius: .45rem;
    text-align: center;
    font-size: .4rem;
    color: #ffffff;
    border: none;
    box-shadow: 5px 1px 18px rgba(0, 0, 0, 0.18);
    margin-top: .3rem;
    margin-left: 5%;
}
